Context Menus

hr.icon

iOS 13以降では、コンテキストメニューを使うことで、インターフェイスを煩雑にすることなく、画面上のアイテムに関連する追加機能にアクセスできるようになります。

https://gyazo.com/d5fa7544fea2508924fabed7a22cf900

コンテキストメニューは「Peek and Pop」と似ていますが、2つの重要な違いがあります。

コンテキストメニューは、iOS 13以降を搭載したすべてのデバイスで利用でき、Peek and Popは3D Touchに対応したデバイスでのみ利用できます。

コンテキストメニューには、コンテキストに関連するコマンドがすぐに表示されますが、Peek and Popでは、コマンドを表示するために上方向にスワイプする必要があります。

コンテキストメニューを表示するには、システムで定義されているタッチ＆ホールドジェスチャーまたは3D Touchを使用できます（3D Touchでは、コンテキストメニューをよりすばやく表示できます）。

コンテキストメニューを開くと、項目のプレビューが表示され、その項目に対応するコマンドが一覧表示されます。

ユーザーは、コマンドを選択したり、アイテムを別のエリア、ウィンドウ、アプリにドラッグしたりすることができます。

コンテキストメニューを一貫して採用する。

ある場所ではアイテムにコンテキストメニューを提供し、別の場所では提供しない場合、人々はどこでその機能を使用できるかわからず、アプリに問題があると思われる可能性があります。

アイテムに適用される最も一般的に使用されるコマンドのみを含めるようにします。

たとえば、Mailメッセージのコンテキストメニューに、返信やメッセージの移動のコマンドを含めることは意味がありますが、フォーマットやメールボックスのコマンドを含めることは意味がありません。

あまりにも多くのコマンドを列挙すると、人々を圧倒してしまいます。

コンテキストメニューの各コマンドには、グリフを付けます。

グリフはコマンドの意味を強調し、その機能を即座に理解するのに役立ちます。

SF シンボルを使用すると、コマンドを表す既存のシンボルを選択したり、関連するシンボルを編集してカスタムグリフを作成したりすることができます。

コンテキストメニューにサブメニューが含まれている場合は、追加コマンドの存在を示すシステム提供のシェブロン記号が自動的に表示されるので、そのためのグリフは必要ありません。

サブメニューを使って複雑さを管理する。

サブメニューとは、論理的に関連したコマンドのセカンドメニューを表示するコンテキストメニューアイテムのことです。

サブメニューには、その内容を説明する直感的なタイトルを付けることで、サブメニューのコマンドを明らかにすることなく予測できるようになります。

また、簡潔で行動に即したタイトルをつけることで、現在の状況では必要のないサブメニューをスキップすることができます。

サブメニューはひとつのレベルにとどめる。

サブメニューは、コンテキストメニューを短くし、ユーザーが実行できるコマンドを明確にすることができますが、サブメニューのレベルが1つ以上になると、エクスペリエンスが複雑になり、ユーザーがナビゲートするのが難しくなります。

使用頻度の高いアイテムをメニューの一番上に配置する。

コンテキストメニューを開くとき、人はそのメニューの一番上の領域に焦点を当てます。

よく使うアイテムをメニューの一番上に配置することで、目的のアイテムを見つけやすくなります。

セパレーターを使って関連するメニュー項目をグループ化する。

視覚的なグループ分けをすることで、メニューをより早く見てもらうことができます。

例えば、アイテムの編集に関連するアクションをグループ化するためのセパレーターと、アイテムの共有に関連するアクションをグループ化するためのセパレーターを使用することができます。

通常、1つのコンテキストメニューには3つ以上のグループは必要ありません。

同じアイテムにコンテキストメニューと編集メニューを用意することは避けてください。

同じアイテムで両方の機能が有効になっていると、ユーザーが混乱し、システムが意図を検出するのが難しくなります。

アイテムのプレビューを開くアクションボタンを用意しないでください。

人々はプレビューしているアイテムをタップして開くことができるので、通常、明示的な「開く」ボタンを提供する必要はありません。